<template>
	
	<view>
	 		<!-- 自定义导航栏 -->
	 				<view class="navBarBox">
	 					<!-- 状态栏占位 -->
	 					<view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view>
	 					<!-- 真正的导航栏内容 -->
	 					<view class="navBar">
	 						<view class="goback">
	 							<view @click="goBack" class="goicon"style="background:url(../../static/goback.png);background-size:contain;background-repeat: no-repeat;">			
	 							</view>
	 						</view>
	 						<view class="title">已开课程</view>
	 						<view class="right">
	 							
	 						</view>
	 					</view>
	 				</view>
	 		<!-- 页面内容 -->
			<view>
				<!-- 04已开课程jg（授课/解散） -->
				<!-- 暂时保留此页面 -->
				<view class="centent1" v-for="(item,index) in getData" :key="item.id">
					<view class="centent1-1">
						<image :src="item.courseCover"  mode=""></image>
					</view>
					
					<view class="centent1-2">
						<view>
							<text>{{item.courseName}}</text>
							<text>{{item.num}}/{{item.maxPersonNum}}</text>
						</view>
						<view>
							<text>{{item.courseName}}-aaa</text>
							<text>周一下午16：00-17:00 周二下午16：00-17:00</text>
						</view>
						<view class="centent1-4">
							<button type="primary">授课结束</button>
							<button type="primary">解散</button>
						</view>
					</view>
				</view>
				
			
				
			</view>
	 	</view>
	
	
</template>

<script>
	export default {
		data() {
			return {
				getOrgId:'',
				getData:[],
				// 状态栏高度
				statusBarHeight: 0,
				// 导航栏高度
				navBarHeight: 82+11,
			}
		},
		methods: {
			// 返回上一级
			goBack(){
				// 此处是写返回页面的方法、
							
				uni.navigateBack({
				    delta: 1//返回只上一级页面
				});
			},
			getDetail(){
				
					this.$myRequest({
						url: '/teacher/findRelative/' + this.getOrgId,
						method: 'get',
					
						success: (res) => {
							this.getData=res.data.data
							console.log(this.getData,'得到的数据已开课程')
							// this.getTeachers = res.data.data;
					
							// console.log(this.getTeachers, '纯老师')
						},
						fail: (err) => {
							console.log(err)
							console.log('获取数据中')
					
						}
					})
				
			}
		},
		//第一次加载时调用
		created() {
			//获取手机状态栏高度
			this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
		},
		onLoad(option) {
			this.getOrgId=option.id;
			this.getDetail();
			console.log(option.id,'传过来的id')
		}
	}
</script>

<style lang="less">
	*{
		padding: 0;
		margin: 0;
	}
	body{
		background: #e8e8ee;
		padding: 24rpx;
	}
	
	.navBarBox {}
	
		.navBarBox .statusBar {}
	
		.navBarBox .navBar {
			padding: 3rpx 50rpx;
			padding-bottom: 8rpx;
			display: flex;
			justify-content: space-between;
	
			line-height: 93rpx;
			font-size: 40rpx;
		}
	
		.goback {
			flex: 1;
			height: 100%;
		}
		.goicon{
			width: 30rpx;
			height: 30rpx;
			background-color: #00BEA9;
			margin-top: 30rpx;
		}
		.title {
			flex: 1;
			height: 100%;
			
		}
		.right{
			flex: 1;
		}
	
	
	.centent1{
		background: #FFFFFF;
		width: 700rpx;
		height: 260rpx;
		border-radius: 14rpx;
		overflow: hidden;
		display: flex;
		justify-content: center;
		margin-top: 24rpx;
	}
	.centent1:first-child{
		margin-top: 0;
	}
	.centent1-1{
		display: ;
		margin-top: 34rpx;
		margin-left: 18rpx;
		width: 166rpx;
		height: 148rpx;
		background: #4CD964;
		
		image{
			width: 100%;
			height: 100%;
		}
	}
	.centent1-2{
		margin-top: 30rpx;
		margin-left: 10rpx;
		
	}
	.centent1-2 view:first-child{
		width: 484rpx;
		font-size: 32rpx;
		display: flex;
		justify-content: space-between;
		text:last-child{
			color: #ff7944;
		}
	}
	.centent1-2 view:nth-child(2){
		font-size: 20rpx;
		display: flex;
		flex-wrap: wrap;
		padding-top: 28rpx;
		
		text{
			color: #b4b4b4;
			margin-bottom:12rpx ;
		}
	}
	.centent1-4{
		display: flex;
		flex-direction: row;
		justify-content: flex-end;
		button{
			width: 166rpx;
			height: 52rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			background: #f9921c;
			color: #FFFFFF;
			font-size: 26rpx;
			padding: 0;
		}
		button:last-child{
			width: 120rpx;
			height: 52rpx;
			margin-left: 22rpx;
			background-color: #01beaa;
			// line-height: 52rpx;
			font-size: 28rpx;
			color: #FFFFFF;
			display: flex;
			justify-content: center;
		}
	}
</style>
